<template>
  <view class="search-schedule">
    <HeaderNavTabarVue title="申请" />
    <uni-search-bar
      v-model="searchValue"
      cancelButton="none"
      class="searchBar"
      clearButton="auto"
      placeholder="请输入申请名称"
      radius="8rpx"
      @input="search"
    />

    <scroll-view
      scroll-y="true"
      class="scroll-Y"
      :style="`height: calc(100vh - (${getTitleBarHeight() * 2}rpx + 110rpx))`"
    >
      <ScheduleCard
        v-for="(item, index) in ScheduleCardList"
        :key="index"
        :timeTop="dayjs(item.startTime).format('HH:mm')"
        :timeBottom="dayjs(item.endTime).format('HH:mm')"
        :cardContent="item.describe"
        :cardTitle="item.reason"
        :countPerson="item.participants?JSON.parse(item?.participants)?.length : 0"
        :activeClass="item.activeClass"
        :scheduleType="item.type"
        @tap="goDefineScheduleView(item)"
      />
    </scroll-view>
  </view>
</template>

<script setup>
import { ref } from 'vue'
import HeaderNavTabarVue from '@/components/HeaderNavTabar/HeaderNavTabar.vue'
import ScheduleCard from '@/pages/schedule/module/ScheduleCard.vue'
import { getTitleBarHeight } from '@/utils/system'
import { onLoad, onShow } from '@dcloudio/uni-app'
import dayjs from 'dayjs'
import { getScheduleRecord } from '@/api/schedule'
import { getUserProfile } from '@/api/system/user'
import { getDeptTree } from '@/api/dep'
const userIdsProps = ref(null)

const searchValue = ref(null)
const ScheduleCardList = ref([
  {
    timeTop: '08:00',
    timeBottom: '10:10',
    cardTitle: '王世豪预定的会议',
    cardContent: '描述内容描述内容描述内容',
    countPerson: '3',
    activeClass: true,
    scheduleType: '类型',
  },
])

const goDefineScheduleView = (item) => {
  uni.navigateTo({
    url:
      '/pages/schedule/components/defineSchduleRecord?item=' +
      encodeURIComponent(JSON.stringify(item)),
  })
}


function debounce(func, wait) {
  let timeout
  return function(...args) {
    const context = this
    clearTimeout(timeout)
    timeout = setTimeout(() => func.apply(context, args), wait)
  }
}

const personIdArr = ref([])
let searchApiFn = debounce(async function() {
  let params = {
    userIds: [...personIdArr.value,...userIdsProps.value],

    reason:searchValue.value
  }
  let { code, rows } = await getScheduleRecord(params)
  if (code === 200) {
    ScheduleCardList.value = rows
		console.log(ScheduleCardList.value,'ScheduleCardList.value')
  }
}, 500)
const search = () => {
  searchApiFn()
}

onShow(()=>{
	searchApiFn()
})
onLoad(async (props) => {
  if(props.personIdArr){
    personIdArr.value = props.personIdArr.split(',')
  }else {
    personIdArr.value = []
  }
  userIdsProps.value = await  getUserProfile().then((res) => [res.data.userId])
    let params = {
      userIds: [...personIdArr.value,...userIdsProps.value],
    }

    let { rows } = await getScheduleRecord(params)
    ScheduleCardList.value = rows
})
</script>

<style scoped lang="scss">
.search-schedule {
  background: #fff;

  .searchBar {
    height: 120rpx;
  }
}
</style>
